const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const { VueLoaderPlugin } = require('vue-loader');

module.exports = {
	entry: {
		app: './src/index.ts'
	},
	module: {
		rules: [
			{
				test: /\.vue$/,
				use: [
					{
						loader: 'vue-loader'
					}
				]
			},
			{
				test:/\.(ts|tsx)?$/,
				use: [
					{
						loader:'ts-loader',       
						options:{            
								appendTsSuffixTo:[/\.vue$/],   //为script有lang='ts'标识的脚本文件添加ts后缀        
						}
					}
				],
			},
			{
				test: /\.(css|less)$/,
				use: [
					{
						loader: 'style-loader'
					},
					{
						loader: 'css-loader'
					},
					{
						loader: 'less-loader'
					}
				]
			},
			{
				test: /\.(jpg|jpeg|png|svg|gif|ico)$/,
				use: [
					{
						loader: 'file-loader'
					}
				]
			},
			// {
			// 	test: /\.(woff|woff2|eot|ttf|otf)$/,
			// 	use: [
			// 		{
			// 			loader: 'file-loader'
			// 		}
			// 	]
			// },
		// 	{
		// 		test: /\.html$/,
		// 		loader: 'html-loader?attrs[]=video:src'
		// 	}, {
		// 		test: /\.mp4$/,
		// 		loader: 'url?limit=10000&mimetype=video/mp4'
		// }
			// {
			// 	test: /\.(mp4)(\?.*)?$/,
			// 	loader: 'file-loader',
			// 	options: {
			// 		name:'audios/[name].[ext]',
			// 		limit:10000
			// 	}
			// }
		]
	},
	resolve: {
		extensions: ['.js', '.ts', 'tsx', '.vue'],
		alias: {
			'@': path.resolve('src'),
			// 'vue$': 'vue/dist/vue.esm.js' 
		}
	},
	plugins: [
		new webpack.DefinePlugin({
			__VUE_OPTIONS_API__: JSON.stringify(true),
			__VUE_PROD_DEVTOOLS__: JSON.stringify(false)
		}),
		new CleanWebpackPlugin(),
		new HtmlWebpackPlugin({
			title: 'vcms_dev',
			template: path.resolve(__dirname, '../public/index.html'),
			favicon: path.join(__dirname, '../public/favicon.ico')
		}),
		new VueLoaderPlugin()
	],
	output: {
		filename: '[name].bundle.js',
		path: path.resolve(__dirname, '../dist')
	}
}